<template>
	<view class="header" :style="{ backgroundColor: bgColor }">
		<view class="header-left">
			<uni-icons type="arrow-left" size="30" @click="goBack" color="#000"></uni-icons>
			<view class="content">
				<!-- 添加一个插槽 -->
				<slot name="content"></slot>
			</view>
		</view>

		<view class="icon">
			<text class="iconfont icon-kefu"></text>
		</view>
	</view>
</template>

<script setup>
defineProps({
	bgColor: {
		type: String,
		default: '#f1f3f5'
	}
});
const goBack = () => {
	uni.navigateBack();
};
</script>

<style lang="scss">
.header {
	background: v-bind(bgColor);
	height: 100rpx;
	top: 0;
	left: 0;
	right: 0;
	line-height: 100rpx;
	position: fixed;
	z-index: 999;
	display: flex;
	justify-content: space-between;
	font-size: 36rpx;
	.header-left {
		display: flex;
		padding-left: 20rpx;
		.content {
			font-weight: bold;
			padding-left: 20rpx;
		}
	}
}
.icon {
	padding-right: 60rpx;
	text{
		font-weight: bold;
		font-size: 36rpx;
	}
}
</style>
